<%--
  Created by IntelliJ IDEA.
  User: 22328
  Date: 2021/2/5
  Time: 14:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<head>
    <title>焕耀商城－首页</title>
    <link rel="stylesheet" type="text/css" href="./css/reset.css">
    <link rel="stylesheet" type="text/css" href="./css/main.css">
    <script type="text/javascript" src="./js/jquery-3.1.0.min.js"></script>
    <script type="text/javascript" src="./js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="./js/slide.js"></script>
</head>
<body>
<!--头部  开始-->
<div class="header_con">
    <div class="header">
        <div class="welcome fl">欢迎来到焕耀商城!</div>
        <div class="login_btn fl"><a href="./main" style="margin-left:30px"
                                     target="_blank">邂逅·好物</a></div>
        <div class="fr">
            <c:if test="${sessionScope.user!=null}">
                <div class="login_info fl" style="display: block">
                    欢迎您：<em>${sessionScope.user.userName}</em>
                    <a href="./login" class="zhuxiao">注销</a>
                </div>
                <div class="login_btn fl" style="display:none">
                    <a href="./login">登录</a>
                    <span>|</span>
                    <a href="./register">注册</a>
                </div>
                <div class="user_link fl">
                    <span>|</span>
                    <a href="./getPersonalHtml">用户中心</a>
                    <span>|</span>
                    <a href="./getCartHtml?userId=${sessionScope.user.id}">我的购物车</a>
                    <span>|</span>
                    <a href="./getOrderHtml?userId=${sessionScope.user.id}">我的订单</a>
                </div>
            </c:if>
            <c:if test="${sessionScope.user==null}">
                <div class="login_btn fl">
                    <a href="./login">登录</a>
                    <span>|</span>
                    <a href="./register">注册</a>
                </div>
                <div class="user_link fl">
                    <span>|</span>
                    <a href="./login">用户中心</a>
                    <span>|</span>
                    <a href="./login">我的购物车</a>
                    <span>|</span>
                    <a href="./login">我的订单</a>
                </div>
            </c:if>
        </div>
    </div>
</div>
<!--头部 结束-->

<!--导航和轮播部分 开始-->
<div class="search_bar clearfix">
    <a href="#" class="logo fl"><img src="images/logo.png"></a>
    <div class="search_con fl">
        <form method="get" action="./getMainQuery" target="_self">
            <input type="text" class="input_text fl" name="desc" id="desc" value="" placeholder="搜索商品">
            <input type="submit" class="input_btn fr" value="搜索">
        </form>
    </div>
    <div class="guest_cart fr">
        <c:if test="${sessionScope.user!=null}">
            <a href="./getCartHtml?userId=${sessionScope.user.id}" class="cart_name fl">我的购物车</a>
            <div class="goods_count fl" id="show_count">${sessionScope.user.cartBuyNums}</div>
        </c:if>
        <c:if test="${sessionScope.user==null}">
            <a href="./login" class="cart_name fl">我的购物车</a>
            <div class="goods_count fl" id="show_count"></div>
        </c:if>
    </div>
</div>

<div class="navbar_con">
    <div class="navbar">
        <h1 class="fl">全部商品分类</h1>
        <ul class="navlist fl">
            <li><a href="#">首页</a></li>
            <li class="interval">|</li>
            <li><a href="#">火热招商</a></li>
            <li class="interval">|</li>
            <li><a href="#">抽奖</a></li>
        </ul>
    </div>
</div>

<div class="center_con clearfix">
    <ul class="subnav fl">
        <li><a href="#model01" class="">衣物</a></li>
        <li><a href="#model02" class="">美妆</a></li>
        <li><a href="#model03" class="">书籍</a></li>
        <li><a href="#model04" class="">电子</a></li>
        <li><a href="#model05" class="">玩具</a></li>
        <li><a href="#model06" class="">食物</a></li>
    </ul>
    <div class="slide fl">
        <ul class="slide_pics">
            <li><img src="./images/advertisment/lunbo001.jpg" alt="幻灯片"></li>
            <li><img src="./images/advertisment/lunbo002.jpg" alt="幻灯片"></li>
            <li><img src="./images/advertisment/lunbo003.jpg" alt="幻灯片"></li>
            <li><img src="./images/advertisment/lunbo003.jpg" alt="幻灯片"></li>
        </ul>
        <div class="prev"></div>
        <div class="next"></div>
        <ul class="points"></ul>
    </div>

    <div class="adv fl">
        <a href="#"><img src="./images/advertisment/adv01.png"></a>
        <a href="#"><img src="./images/advertisment/adv02.png"></a>
    </div>
</div>
<!--导航和轮播部分 结束-->

<!--全部商品 开始-->
<div class="list_model">
    <div class="list_title clearfix">
        <h3 class="fl" id="model01">衣物</h3>
        <div class="subtitle fl">
            <span>|</span>
            <c:forEach items="${clothingGoods}" var="good">
                <a href="./goodsDetail?id=${good.id}">${good.goodsName}${good.goodsDesc}</a>
            </c:forEach>
        </div>
        <a href="./readMoreGoods?categoryId=1&page=1&limit=12" class="goods_more fr" id="fruit_more">查看更多 &gt;</a>
    </div>

    <div class="goods_con clearfix">
        <div class="goods_banner fl"><img src="images/clothing.png"></div>
        <ul class="goods_list fl">
            <c:forEach items="${clothingGoods}" var="good">
                <li>
                    <h4><a href="./goodsDetail?id=${good.id}">${good.goodsName} ${good.goodsDesc} </a></h4>
                    <a href="./goodsDetail?id=${good.id}"><img src="${good.goodsImg}"></a>
                    <div class="prize">¥ ${good.goodsPrice}</div>
                </li>
            </c:forEach>
        </ul>
    </div>
</div>

<div class="list_model">
    <div class="list_title clearfix">
        <h3 class="fl" id="model02">美妆</h3>
        <div class="subtitle fl">
            <span>|</span>
            <c:forEach items="${beautyGoods}" var="good">
                <a href="./goodsDetail?id=${good.id}">${good.goodsName}${good.goodsDesc}</a>
            </c:forEach>
        </div>
        <a href="./readMoreGoods?categoryId=2&page=1&limit=12" class="goods_more fr">查看更多 &gt;</a>
    </div>

    <div class="goods_con clearfix">
        <div class="goods_banner fl"><img src="./images/beauty.jpg"></div>
        <ul class="goods_list fl">
            <c:forEach items="${beautyGoods}" var="good">
                <li>
                    <h4><a href="./goodsDetail?id=${good.id}">${good.goodsName} ${good.goodsDesc} </a></h4>
                    <a href="./goodsDetail?id=${good.id}"><img src="${good.goodsImg}"></a>
                    <div class="prize">¥ ${good.goodsPrice}</div>
                </li>
            </c:forEach>
        </ul>
    </div>
</div>

<div class="list_model">
    <div class="list_title clearfix">
        <h3 class="fl" id="model03">书籍</h3>
        <div class="subtitle fl">
            <span>|</span>
            <c:forEach items="${bookGoods}" var="good">
                <a href="./goodsDetail?id=${good.id}">${good.goodsName}${good.goodsDesc}</a>
            </c:forEach>
        </div>
        <a href="./readMoreGoods?categoryId=3&page=1&limit=12" class="goods_more fr">查看更多 &gt;</a>
    </div>

    <div class="goods_con clearfix">
        <div class="goods_banner fl"><img src="./images/book.png"></div>
        <ul class="goods_list fl">
            <c:forEach items="${bookGoods}" var="good">
                <li>
                    <h4><a href="./goodsDetail?id=${good.id}">${good.goodsName} ${good.goodsDesc} </a></h4>
                    <a href="./goodsDetail?id=${good.id}"><img src="${good.goodsImg}"></a>
                    <div class="prize">¥ ${good.goodsPrice}</div>
                </li>
            </c:forEach>
        </ul>
    </div>
</div>

<div class="list_model">
    <div class="list_title clearfix">
        <h3 class="fl" id="model04">电子</h3>
        <div class="subtitle fl">
            <span>|</span>
            <c:forEach items="${electronicGoods}" var="good">
                <a href="./goodsDetail?id=${good.id}">${good.goodsName}${good.goodsDesc}</a>
            </c:forEach>
        </div>
        <a href="./readMoreGoods?categoryId=4&page=1&limit=12" class="goods_more fr">查看更多 &gt;</a>
    </div>

    <div class="goods_con clearfix">
        <div class="goods_banner fl"><img src="./images/electronic.png"></div>
        <ul class="goods_list fl">
            <c:forEach items="${electronicGoods}" var="good">
                <li>
                    <h4><a href="./goodsDetail?id=${good.id}">${good.goodsName} ${good.goodsDesc} </a></h4>
                    <a href="./goodsDetail?id=${good.id}"><img src="${good.goodsImg}"></a>
                    <div class="prize">¥ ${good.goodsPrice}</div>
                </li>
            </c:forEach>
        </ul>
    </div>
</div>

<div class="list_model">
    <div class="list_title clearfix">
        <h3 class="fl" id="model05">玩具</h3>
        <div class="subtitle fl">
            <span>|</span>
            <c:forEach items="${toyGoods}" var="good">
                <a href="./goodsDetail?id=${good.id}">${good.goodsName}${good.goodsDesc}</a>
            </c:forEach>
        </div>
        <a href="./readMoreGoods?categoryId=5&page=1&limit=12" class="goods_more fr">查看更多 &gt;</a>
    </div>

    <div class="goods_con clearfix">
        <div class="goods_banner fl"><img src="./images/toy.png"></div>
        <ul class="goods_list fl">
            <c:forEach items="${toyGoods}" var="good">
                <li>
                    <h4><a href="./goodsDetail?id=${good.id}">${good.goodsName} ${good.goodsDesc} </a></h4>
                    <a href="./goodsDetail?id=${good.id}"><img src="${good.goodsImg}"></a>
                    <div class="prize">¥ ${good.goodsPrice}</div>
                </li>
            </c:forEach>
        </ul>
    </div>
</div>

<div class="list_model">
    <div class="list_title clearfix">
        <h3 class="fl" id="model06">食物</h3>
        <div class="subtitle fl">
            <span>|</span>
            <c:forEach items="${foodGoods}" var="good">
                <a href="./goodsDetail?id=${good.id}">${good.goodsName}${good.goodsDesc}</a>
            </c:forEach>
        </div>
        <a href="./readMoreGoods?categoryId=6&page=1&limit=12" class="goods_more fr">查看更多 &gt;</a>
    </div>

    <div class="goods_con clearfix">
        <div class="goods_banner fl"><img src="./images/food.jpg"></div>
        <ul class="goods_list fl">
            <c:forEach items="${foodGoods}" var="good">
                <li>
                    <h4><a href="./goodsDetail?id=${good.id}">${good.goodsName} ${good.goodsDesc} </a></h4>
                    <a href="./goodsDetail?id=${good.id}"><img src="${good.goodsImg}"></a>
                    <div class="prize">¥ ${good.goodsPrice}</div>
                </li>
            </c:forEach>
        </ul>
    </div>
</div>
<!--全部商品 结束-->

<!--底部 开始-->
<div class="footer login_footer">
    <div class="links">
        <a href="">关于焕耀</a>
        <span>|</span>
        <a href="">商家入住</a>
        <span>|</span>
        <a href="">联系我们</a>
        <span>|</span>
        <a href="">福利满满</a>
    </div>
    <p>CopyRight © 2021 武汉焕耀科技有限责任公司</p>
</div>
<!--底部 结束-->
</body>
</html>

